<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Bs-url类型的传参经解密后展示内容</title>
    <script language="JavaScript">

        window.onload=function(){
            // console.log(document.getElementById("wjj2").value)//获取隐藏域value值
            //将url变色
            var bsUrl =  document.getElementById("wjj1").value;
            bsUrl = bsUrl.replace(new RegExp('&encrypt', 'g'), '<br/>&encrypt')
            document.getElementById("oDiv1").innerHTML = bsUrl


            var str =  document.getElementById("wjj").value;//获取session值
            // var str =  "{\"event\":\"slash_command\",\"ticket\":\"*****************\"}";//获取session值
            // console.log(str)
            // alert(str)
                //var reg = /^a/gim ;        // ^ 表示匹配开始  $表示匹配结尾
                // var reg = /data/gim ;
                var reg1 = /[:](\".*?\")/gim;//匹配json值
                // var reg1 =  /(['"])?([-_._a-zA-Z_0-9]+)(['"])?,\s/g;//匹配json值
                var reg = /(['"])?([a-zA-Z_0-9]+)(['"])?:/g;//匹配json键
                // var str = "{ \"data\": { \"code\": \"200\", \"length\": 5, \"res\": [ { \"question\": \"测试:唇枪舌剑\", \"question_format\": \"<em>测试</em>:唇枪舌剑\", \"record_id\": \"9ec18c2a-f2ef-4801-bd6d-c23104dedfc3\", \"similar_ratio\": 8.954523 }, { \"question\": \"测试:弃书捐剑\", \"question_format\": \"<em>测试</em>:弃书捐剑\", \"record_id\": \"02bfcb3b-b7cd-4741-8168-89c99377ccd4\", \"similar_ratio\": 8.954523 }, { \"question\": \"测试:刻舟求剑\", \"question_format\": \"<em>测试</em>:刻舟求剑\", \"record_id\": \"41f13a13-f47e-4f28-9b8d-52f71e34f78a\", \"similar_ratio\": 8.954523 }, { \"question\": \"测试:剑拔弩张\", \"question_format\": \"<em>测试</em>:剑拔弩张\", \"record_id\": \"6b098453-f0fd-4385-9be2-753c7adc4ace\", \"similar_ratio\": 8.954523 }, { \"question\": \"测试:故剑情深\", \"question_format\": \"<em>测试</em>:故剑情深\", \"record_id\": \"6e2a48a5-eb87-4f07-86fb-7ecfdbffaafd\", \"similar_ratio\": 8.283585 } ] }, \"errmsg\": \"success\", \"errno\": 0 }";
                // str = JSON.stringify(str)
                var flag = reg.test(str);
                // console.log(flag);
                // console.log(str);


                //修改json键的颜色
                var match = str.match(reg);

                for (i = 0; i < match.length; i++) {
                    match[i] = match[i].replace(/:/g, "")
                }

                var match1 = str.match(reg1);
                // console.log(match.length);
                for (i = 0; i < match.length; i++) {
                    var reg = match[i]

                    // str = str.replace(eval(reg),'<span style="color:red">'+match[i]+'</span>')
                    str = str.replace(new RegExp(reg, 'g'), '<span style="color:#e010b3">' + match[i] + '</span>')
                    // str = str.replace(new RegExp(match1[i],'g'),'<span style="color:red">'+match1[i]+'</span>')

                }

                //修改json值的颜色
                for (i = 0; i < match1.length; i++) {
                    // console.log(match1[i])
                    match1[i] = match1[i].replace(/:"/g, '"')
                    // console.log(match1[i])
                }
                var ss = str.includes(match1[0])
                // console.log(ss);
                for (i = 0; i < match1.length; i++) {
                    // console.log(match1[i]);
                    var ss = str.includes(match1[i])
                    if(!ss){
                        console.log(match1[i])
                    }
                    // console.log(ss);
                    // console.log(match1[i])
                    // console.log(str)
                    aae=new RegExp('[*]', 'g').test(match1[i])
                    // console.log("+++++++++++"+new RegExp(match1[i], 'g').test(str))

                    // str = str.replace(eval(reg),'<span style="color:red">'+match[i]+'</span>')
                    if(aae){
                        console.log("")
                    }else {

                        str = str.replace(new RegExp(match1[i], 'g'), '<span style="color:#0fd42f">' + match1[i] + '</span>')
                    }

                }
                // console.log(str)
                str = str.replace(new RegExp(',', 'g'), ',<br/>')
                str = str.replace(new RegExp('{', 'g'), '{<br/>')
                str = str.replace(new RegExp('}', 'g'), '<br/>}')
                str = str.replace(new RegExp('\\[', 'g'), '[<br/>')
                str = str.replace(/\]/g, '<br/>]')
                var match2 = str.match(/50(.?)/g);
                if (match2!=null){
                    // console.log(match2[0])
                    // console.log(str.includes(match2[0]))

                    str = str.replace(match2[0], '<span style="color:#d91229">' + match2[0]+ '</span>')
                }



                document.getElementById("oDiv").innerHTML = str

        }

    </script>
</head>
<body>
<input id="wjj2" type="hidden" value="kkk">
<input id="wjj" type="hidden" th:value="${session.mimi}">
<input id="wjj1" type="hidden" th:value="${session.bsUrl}">
<!--<span id="wjj1" th:text="${session.bsUrl}"></span>-->
<h1 style="color: #e50a46">请求参数</h1>
<div id="oDiv1" style="color: #e5480d"></div>
<h1 style="color: #e50a46">解密参数结果</h1>
<div id="oDiv" style="color: #01030c"></div>

</body>
</html>